import React, { Component } from 'react'
// vue 自定义组件 <my-app></my-app>
// vue 自定义组件 <my-app>123</my-app> 默认情况下123是不显示的
// 插槽

function Title (props) {
  return (
    <h1>
      { props.children }
    </h1>
  )
}

class Content extends Component {
  render () {
    return (
      <div>
        { this.props.children }
      </div>
    )
  }
}
// react 没有插槽的概念，模拟 props.children
export default class App extends Component {
  render() {
    return (
      <div>
        <Title>这是标题</Title>
        <Content>这是内容</Content>
      </div>
    )
  }
}
